@extends('layouts.admin.application')

@section('content')
    <div class="main-content">
        <div class="col-xs-12">
            <div class="breadcrumbs" id="breadcrumbs">
                <ul class="breadcrumb">
                    <li><i class="icon-home home-icon"></i><a href="{{ route('blog.gallery.index') }}">首页</a></li>
                    <li>我的照片</li>
                </ul>
            </div>

            @include('layouts.partials._flash')

            <div class="table-responsive">
                <div id="sample-table-2_wrapper" class="dataTables_wrapper" role="grid">
                    <div class="row">
                        <div class="col-sm-2">
                            <div id="sample-table-2_length" class="dataTables_length">
                                <a href="{{ route('blog.photo.create') }}"
                                   class="btn btn-sm btn-primary">上传照片</a>

                                <a href="{{ route('blog.gallery.index') }}"
                                   class="btn btn-sm btn-info">返回我的相册</a>
                            </div>

                        </div>

                    </div>
                    <div class="row">
                        <div class="col-xs-12">
                            <div class="row-fluid">
                                <ul class="ace-thumbnails">

                                    @foreach($galleries->photos as $photo)
                                        <li data-id="{{$photo->id}}">
                                            <a href="javascript:;" data-rel="colorbox">
                                                <img alt="150x150" style="width: 200px;height: 200px;"
                                                     src="{{$photo->image}}">
                                                <div class="tags">
													<span class="label-holder">
                                                        @if($galleries->type == 1)
                                                            <span class="label label-default">普通</span>
                                                        @elseif($galleries->type == 2)
                                                            <span class="label label-purple">亲子</span>
                                                        @else
                                                            <span class="label label-info">旅游</span>
                                                        @endif
													</span>

                                                    <span class="label-holder">
                                                        <span class="label label-success">{{$photo->gallery->name}}</span>
													</span>
                                                </div>
                                            </a>
                                            <div style="text-align: center;margin:10px 0 5px 0;">
                                                <span>{{$photo->name}}</span>
                                            </div>

                                            <div class="tools tools-top">
                                                {!! is_like($photo,'like') !!}
                                                <a href="{{route('blog.photo.edit', $photo->id)}}">
                                                    <i class="icon-pencil"></i>
                                                </a>

                                                <a href="javascript:;">
                                                    <i class="icon-remove red del_one"></i>
                                                </a>
                                            </div>
                                        </li>
                                    @endforeach
                                </ul>
                            </div><!-- PAGE CONTENT ENDS -->
                        </div><!-- /.col -->
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection

@section('js')
    <script>
        $(function () {

            //点赞
            $('.change_attr').click(function () {
                var data = {
                    id: $(this).parents('li').data('id'),
                    attr: $(this).attr('data-attr')
                };
                var _this = $(this);
                $.ajax({
                    type: 'PATCH',
                    url: "{{route('blog.photo.change_attr')}}",
                    data: data,
                    success: function () {
                        _this.toggleClass('icon-hand-up icon-hand-down');
                    }
                })
            });

            //ajax删除照片
            $('.del_one').click(function () {
                var id = $(this).parents('li').data('id');
                var _this = $(this);
                $.ajax({
                    type: 'DELETE',
                    url: '/admin/blog/photo/' + id,
                    data: id,
                    success: function () {
                        _this.parents('li').fadeOut(400);
                    }
                })
            })
        })
    </script>
@endsection